<template>
  <!-- 新建文件夹 -->
  <el-dialog
    title="新建文件夹"
    :visible.sync="dialogFolderVisible"
    @close="close"
    width="30%" class="dialog-style">
    <div class="createFolder">
      <el-input placeholder="请输入文件夹名称" v-model="folderName"></el-input>
      <el-button type="primary" @click="createFolder">创建</el-button>
    </div>
  </el-dialog>
</template>

<script>

import api from "../../apis/api";

export default {
  name: "CreateFolder",
  props:['dialogVisible'],
  data() {
    return {
      folderName: ''
    }
  },
  // 使用计算属性修改组件状态，直接使用props修改会报warn
  computed:{
    dialogFolderVisible:{
      get: function(){
        return this.dialogVisible
      },
      set: function(){}
    }
  },
  methods:{
    createFolder(){
      let that = this
      api.createFolder(that.$store.state.folder.folderId,this.folderName).then(response => {
        if (response.code === 200){
          this.$util.successMessage(response.message)
          this.close()
          this.$router.go(0)
        }else {
          this.$util.errorMessage(response.message)
        }
      })
    },
    close(){
      this.$emit('close')
    }
  }
}
</script>

